<script lang="ts" setup>
interface Props {
    type?: string;
    size?: string;
    text?: string;
    color?: string;
    icon?: string;
    iconPrefix?: string;
    iconPosition?: string;
    tag?: string;
    nativeType?: string;
    block?: boolean;
    plain?: boolean;
    square?: boolean;
    round?: boolean;
    disabled?: boolean;
    hairline?: boolean;
    loading?: boolean;
    loadingText?: string;
    loadingType?: string;
    loadingSize?: string;
    url?: string;
    to?: string;
    replace?: boolean;
    value?: string;
}

// 使用 withDefaults 设置默认值
withDefaults(defineProps<Props>(), {
    type: "primary",
    size: "medium",
    text: "",
    color: "",
    icon: "",
    iconPrefix: "van-icon",
    iconPosition: "left",
    tag: "button",
    nativeType: "button",
    block: false,
    plain: false,
    square: false,
    round: false,
    disabled: false,
    hairline: false,
    loading: false,
    loadingText: "",
    loadingType: "circular",
    loadingSize: "20px",
    url: "",
    to: "",
    replace: false,
    value: "默认"
});

</script>

<template>
    <van-button :type="type" :size="size" :text="text" :color="color" :icon="icon" :icon-prefix="iconPrefix"
        :icon-position="iconPosition" :tag="tag" :native-type="nativeType" :block="block" :plain="plain"
        :square="square" :round="round" :disabled="disabled" :hairline="hairline" :loading="loading"
        :loading-text="loadingText" :loading-type="loadingType" :loading-size="loadingSize" :url="url" :to="to"
        :replace="replace">{{ value }}</van-button>
</template>

<style lang="scss" scoped></style>